<template>
  <el-echarts theme="macarons" :option="option"></el-echarts>
</template>
<script>
// import { echartsXFormatter } from '@vimi/utils-tool'
export default {
  components: {},
  props: {},
  data() {
    return {
      orgClass: '',
      option: null,
    }
  },
  computed: {
    clientId() {
      return this.$store.getters.org.clientId
    },
  },
  watch: {},
  created() {
    this.orgClass = this.$utils.getClientOrgClass()
    this.getData()
  },
  mounted() {},
  methods: {
    async getData() {
      const [res] = await this.$utils.promise(this.$http.get(`/industrial/customer/bank/coo/`))
      let data = {
        name: [],
        value: [],
      }
      if (res && res.data && res.data.approvalFundsList.length) {
        res.data.approvalFundsList.forEach(item => {
          if (item.approvalFunds) {
            data.name.push(item.bankName)
            data.value.push({ name: item.bankName, value: item.approvalFunds })
          }
        })
      }
      const chartData = {
        title: '银行合作分析',
        subtext: '审批金额（万元）',
        legend: data.name,
        seriesData: [
          {
            name: '金额（万元）',
            type: 'pie',
            radius: '36%',
            clockwise: false,
            center: ['50%', '40%'],
            data: data.value,
            itemStyle: {
              emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)',
              },
            },
            label: {
              normal: {
                position: 'inner',
                show: false,
              },
              // formatter: v => echartsXFormatter(v.name)
            },
          },
        ],
      }
      this.setOption(chartData)
    },

    setOption(data) {
      this.option = {
        title: {
          text: data.title,
          subtext: data.subtext,
        },
        tooltip: {
          trigger: 'item',
          formatter: '{a} <br/>{b} : {c} ({d}%)',
        },
        legend: {
          type: 'scroll',
          orient: 'vertical',
          height: 100,
          top: 170,
          left: 20,
          // show: false
          // data: data.legend
        },
        toolbox: {
          show: true,
          feature: {
            mark: { show: true },
            dataView: { show: true, readOnly: false },
            saveAsImage: { show: true },
          },
        },
        series: data.seriesData,
      }
    },
  },
}
</script>
<style scoped></style>
